<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0">
    <meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="format-detection" content="telephone=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <link href="../admin/css/SYSFrame.css" rel="stylesheet" type="text/css">
    <link href="../admin/font/iconfont.css" rel="stylesheet" type="text/css">
    <link href="../admin/css/module.css" rel="stylesheet" type="text/css">
    <link href="../admin/css/pages.css" rel="stylesheet" type="text/css">
    <title>会员信息</title>
    <script src="../admin/js/jquery-1.9.1.min.js" type="text/javascript"></script>
    <script src="../admin/js/jquery.nicescroll.js" type="text/javascript"></script>
    <script src="../admin/js/HUpages.js" type="text/javascript"></script>
    <script src="../admin/js/template.js" type="text/javascript"></script>
    <!--[if lt IE 9]>
    <script src="../admin/js/html5shiv.js" type="text/javascript"></script>
    <script src="../admin/js/css3-mediaqueries.js" type="text/javascript"></script>
    <![endif]-->
</head>

<body id="pagestyle">
<div class="bk-con-message message-section leftMessage" id="iframe_box" style="left: 200px; width: 1080px; float: left; position: absolute; height: 567px; padding: 15px;">
    <div class="page_content clearfix padding15" id="memberList" style="height: 537px; overflow: hidden; outline: currentcolor none medium;" tabindex="5000">				<div class="add_content clearfix mt15 member_content">
        <ul class="info_list" id="VerifyTips">
            <li class="clearfix content_look mb15">
                <label class="label_name">用户头像：</label>
                <span class="info_data">
					<div class="gradeimg-style">
						<div class="Upload-screenshot">
							<img class="addImg" src="../admin/images/zjbg_03.png" onerror="this.src='images/zjbg_03.png',this.onerror=null" style="display: none;">
							<input name="url" type="file" class="upload_input" accept="image/*">
							<input type="hidden" id="img" name="img">
							<div class="preBlock" style="z-index: 1;">



								<img class="preview" alt="" name="pic" data-src="2.jpg" src="../admin/images/memberimg/2.jpg" onerror="this.src='images/zjbg_03.png',this.onerror=null">
							</div>
							<img class="delete" src="../admin/images/delete.png" style="display: block;">
						</div>
					</div>
			    </span>
            </li>
            <li class=" clearfix content_look mb15">
                <label class="label_name"><em style="color:Red;">*</em>用户名：</label>
                <span class="info_data"><input data-name="用户名" type="text" name="Required" value="李明" class="text_input col-sm-4" data-verify="verify"></span>
            </li>
            <li class=" clearfix content_look mb15">
                <label class="label_name"><em style="color:Red;">*</em>昵称：</label>
                <span class="info_data"><input data-name="昵称" type="text" name="Required" value="李师师" class="text_input col-sm-4" data-verify="verify"></span>
            </li>
            <li class=" clearfix content_look mb15">
                <label class="label_name">性别：</label>
                <span class="info_data">
		                        <label class="radio relative"><input name="sexradio" type="radio" class="ace" data-id="0"><span class="lbl">保密</span></label>&nbsp;&nbsp;
								<label class="radio relative"><input name="sexradio" type="radio" class="ace" data-id="1"><span class="lbl">男</span></label>&nbsp;&nbsp;
								<label class="radio relative"><input name="sexradio" type="radio" class="ace" data-id="2"><span class="lbl">女</span></label>
								</span>
            </li>
            <li class=" clearfix content_look mb15">
                <label class="label_name">年龄：</label>
                <span class="info_data"><input data-name="年龄" name="Required" value="27" type="text" class="text_input col-sm-4"></span>
            </li>
            <li class=" clearfix content_look mb15">
                <label class="label_name">等级：</label>
                <span class="info_data">铜牌会员</span>
            </li>
            <li class=" clearfix content_look mb15">
                <label class="label_name">家庭地址：</label>
                <span class="info_data">江苏-南京-建邺区-江东中国南路2号将普大厦204号</span>
            </li>
            <li class=" clearfix content_look mb15">
                <label class="label_name"><em style="color:Red;">*</em>经验值：</label>
                <span class="info_data"><input data-name="职位" name="Required" value="1000" type="text" class="text_input col-sm-4" data-verify="verify"></span>
            </li>
            <li class=" clearfix content_look mb15">
                <label class="label_name"><em style="color:Red;">*</em>状态：</label>
                <span class="info_data">
			        			<label class="radio relative"><input name="statusradio" type="radio" data-id="1" class="ace"><span class="lbl">启用</span></label>&nbsp;&nbsp;
								<label class="radio relative"><input name="statusradio" type="radio" data-id="0" class="ace"><span class="lbl">关闭</span></label>&nbsp;&nbsp;
								</span>
            </li>
            <li class=" clearfix content_look mb15">
                <label class="label_name"><em style="color:Red;">*</em>手机：</label>
                <span class="info_data"><input data-name="手机号码" name="Required" type="text" value="18945678900" class="text_input col-sm-4" data-prompt="phone" data-verify="verify"></span>
            </li>
            <li class=" clearfix content_look mb15">
                <label class="label_name"><em style="color:Red;">*</em>固定电话：</label>
                <span class="info_data"><input data-name="固定电话" name="Required" type="text" value="028-56434567" class="text_input col-sm-4" data-prompt="phone" data-verify="verify"></span>
            </li>
            <li class=" clearfix content_look mb15">
                <label class="label_name"><em style="color:Red;">*</em>邮箱：</label>
                <span class="info_data"><input data-name="邮箱" name="Required" type="text" value="123456789@qq.com" class="text_input col-sm-4" data-prompt="mailbox" data-verify="verify"></span>
            </li>
            <li class=" clearfix content_look mb15">
                <label class="label_name">说明：</label>
                <span class="info_data">
									<textarea data-name="说明" name="Required" class="form-textarea textarea-info" id="form_textarea" placeholder="">开开心心过每一天的生活！</textarea>
								<span class="word_count">剩余字数 :<em class="colorred number">188</em>字符</span></span>
            </li>
        </ul>
        <div class="buttonstyle">
            <button type="button" class="btn padding10 bg-deep-blue" onclick="modifybtn()">确认修改</button>
            <button type="button" class="btn padding10 bg-green" onclick="gradelink(this,2)">返回上一步</button>
        </div>
    </div>
        <script>
            var api = ""; //调用的api接口
            var type = 1; //类型
            //调用图片上传
            imgUpload(api, type);
            new Wordcount("form_textarea",200);
            var logo=document.getElementsByClassName("preview");
            var classname=document.getElementsByClassName("addImg");
            var preBlock=document.getElementsByClassName("preBlock");
            var deletes=document.getElementsByClassName("delete");
            if(logo[0].dataset.src!=""){
                classname[0].style.display = 'none';
                deletes[0].style.display = 'block';
                preBlock[0].style.zIndex='1';
            }else{
                classname[0].style.display = 'block';
                deletes[0].style.display = 'none';
                preBlock[0].style.zIndex='-1';
            }

            //提交操作
        </script></div>
</div>




<script>
    $(function() {
        //内页框架结构编辑
        $("#pagestyle").Hupage({
            slide: '#breadcrumb',
            padding: 15,
            clickBombbox:'.menulist',
            menuModule: '#bk-con-menu', //菜单模块
            pagecontent: '.page_content', //自定义属性
            operation: '.operation', //自定义属性
            scrollbar: function(e) {
                e.niceScroll({
                    cursorcolor: "#dddddd",
                    cursoropacitymax: 1,
                    touchbehavior: false,
                    cursorwidth: "3px",
                    cursorborder: "0",
                    cursorborderradius: "3px",
                });
            },
            expand: function(thisBox, settings) {
                var pc = "";
                $(settings.pagecontent).css("margin-bottom") != null ? pc = parseInt($(settings.pagecontent).css("margin-bottom").replace("px", "")) : '';
                $(settings.pagecontent).css({
                    height: $(window).height() - $(settings.operation).outerHeight() - pc - (settings.padding * 2)
                })
                settings.scrollbar($(settings.slide) && $(settings.pagecontent));
            } //自定义方法
        });
    });
    //等级列表数据
    var memberdata = function(callback) {
        $.ajax({
            url: "json/member.json",
            type: "GET",
            dataType: 'json',
            success: function(ret) {
                typeof callback == 'function' && callback(ret);
            },
        });
    };
    memberdata(function(dataArr) {
        var gradehtml = $('#gradeList');
        var html = template('gradehtml', {
            grade: dataArr.grade
        });
        gradehtml.html(html);
        $("#gradehtml").remove();
        var data = null;
        var id = 0;
        memberList(dataArr, data, id)
    });
    //会员显示列表
    function memberList(dataArr, data, id) {
        if(data == null) {
            var data = dataArr.data;
        }
        $.ajax({
            url: "html/member/index.html",
            type: "GET",
            dataType: "html",
            success: function(result) {
                $('body').append("<script id='memberhtml' type='text/html'>" + result + "</script\>");
                var memberlist = $('#memberList');
                var html = template('memberhtml', {
                    id: id,
                    list: data,
                    grade: dataArr.grade
                });
                memberlist.html('');
                memberlist.html(html);
                new TableSorter("tableList", 1, 2, 8); //设置
                $("#memberhtml").remove(); //加载完毕删除模版路径
                $("#quantity").html(data.length);//数据数量

            }
        });
    }
    //筛选分类用户信息数据
    function gradelink(obj, id) {
        var listdata = function(callback) {
            $.ajax({
                url: "json/member.json",
                type: "GET",
                dataType: 'json',
                success: function(ret) {
                    typeof callback == 'function' && callback(ret);
                },
            });
        };
        listdata(function(dataArr) {
            if(id == 0) {
                var data = null;
            } else {
                var data = dataArr.data.filter(function(e) {
                    return e.grade == id;
                });
            }
            memberList(dataArr, data, id);
        });
    }
    //查看用户信息
    function memberinfo(obj, id) {
        var content = function(callback) {
            $.ajax({
                url: "json/member.json",
                type: "GET",
                dataType: 'json',
                success: function(ret) {
                    typeof callback == 'function' && callback(ret);
                },
            });
        };
        content(function(dataArr) {
            var data = dataArr.data.filter(function(e) {
                return e.id == id;
            });
            $.ajax({
                url: "html/member/content.html",
                type: "GET",
                dataType: "html",
                success: function(result) {
                    $('body').append("<script id='contenthtml' type='text/html'>" + result + "</script\>");
                    var contentname = $('#memberList');
                    var html = template('contenthtml', {
                        id:id,
                        info: data,
                        grades: dataArr.grade
                    });
                    contentname.html('');
                    contentname.html(html);
                    $("#contenthtml").remove(); //加载完毕删除模版路径
                    var radios = document.getElementsByName("statusradio");
                    for(var i = 0; i < radios.length; i++) {
                        var radioid = radios[i].dataset.id;
                        radios[0].checked = true;
                        if(data[0].status == radioid) {
                            radios[i].checked = true;
                        } else {
                            radios[i].checked = false;
                        }
                    };
                    var sexradios=document.getElementsByName("sexradio");
                    for(var s = 0; s < sexradios.length; s++) {
                        var sexid = sexradios[s].dataset.id;
                        sexradios[0].checked = true;
                        if(data[0].sex == sexid) {
                            sexradios[s].checked = true;
                            return;
                        } else {
                            sexradios[s].checked = false;
                        }
                    };
                }
            });
        });
    };
</script>
<script type="text/javascript" src="../admin/js/common.js"></script><script>
    (function() {
        var ws = new WebSocket('ws://' + window.location.host + '/jb-server-page?reloadServiceClientId=198');
        ws.onmessage = function (msg) {
            if (msg.data === 'reload') {
                window.location.reload();
            }
            if (msg.data.startsWith('update-css ')) {
                var messageId = msg.data.substring(11);
                var links = document.getElementsByTagName('link');
                for (var i = 0; i < links.length; i++) {
                    var link = links[i];
                    if (link.rel !== 'stylesheet') continue;
                    var clonedLink = link.cloneNode(true);
                    var newHref = link.href.replace(/(&|\?)jbUpdateLinksId=\d+/, "$1jbUpdateLinksId=" + messageId);
                    if (newHref !== link.href) {
                        clonedLink.href = newHref;
                    }
                    else {
                        var indexOfQuest = newHref.indexOf('?');
                        if (indexOfQuest >= 0) {
                            // to support ?foo#hash
                            clonedLink.href = newHref.substring(0, indexOfQuest + 1) + 'jbUpdateLinksId=' + messageId + '&' +
                                newHref.substring(indexOfQuest + 1);
                        }
                        else {
                            clonedLink.href += '?' + 'jbUpdateLinksId=' + messageId;
                        }
                    }
                    link.replaceWith(clonedLink);
                }
            }
        };
    })();
</script><div id="ascrail2000" class="nicescroll-rails" style="width: 3px; z-index: auto; cursor: default; position: absolute; top: 15.6667px; left: 1261.33px; height: 536px; opacity: 0; display: block;"><div style="position: relative; top: 265px; float: right; width: 3px; height: 271px; background-color: rgb(221, 221, 221); border: 0px none; background-clip: padding-box; border-radius: 3px;"></div></div><div id="ascrail2000-hr" class="nicescroll-rails" style="height: 3px; z-index: auto; top: 548.333px; left: 215.667px; position: absolute; cursor: default; opacity: 0; display: none; width: 1046px;"><div style="position: relative; top: 0px; height: 3px; width: 1049px; background-color: rgb(221, 221, 221); border: 0px none; background-clip: padding-box; border-radius: 3px; left: 0px;"></div></div><script id="memberhtml" type="text/html">
    <div class="operation  mb15 clearfix relative">
        <button class="btn button_btn btn-danger" type="button" onclick=""><i class="iconfont">&#xe6b4</i>&nbsp;批量删除</button>
        <span class="sumQuantity">合计：<em id="quantity"></em>条</span>
    </div>
    <table class="gallery table table_list table_striped table-bordered border " id="tableList">
        <thead>
        <tr>
            <th width="50px"><label class="checkbox relative"><input type="checkbox" class="ace" name="checkbox"><span class="lbl"></span></label></th>
            <th>等级</th>
            <th>状态</th>
            <th>用户名</th>
            <th>性别</th>
            <th>电话</th>
            <th>邮箱</th>
            <th>地址</th>
            <th>注册时间</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
        <%if(list!=""){ %>
        <% for(var i = 0; i < list.length; i++) { %>
        <tr class="relative">
            <td><label class="checkbox relative"><input type="checkbox" class="ace" name="checkbox"><span class="lbl"></span></label></td>
            <td>
                <% for(var s = 0; s < grade.length; s++) { %>
                <% if(grade[s].id==list[i].grade) {%>
                <%=grade[s].name%>
                <% } %>
                <% } %>
            </td>
            <td>
                <% if(list[i].status==0) {%>
                <span class="name_status  plf10 btn btn-gray" data-id="0">关闭</span>
                <%} if(list[i].status==1) {%>
                <span class="name_status  plf10 btn btn-green" data-id="1">启用</span>
                <%}%>
            </td>
            <td><a href="javascript:void(0)" class="colorred" onclick="memberinfo(this,<%=list[i].id%>)"><%=list[i].name%></a></td>
            <td>
                <% if(list[i].sex==0) {%>
                保密
                <%} else if(list[i].sex==1) {%>
                男
                <%} else if(list[i].sex==2){%>
                女
                <% }%>
            </td>
            <td><%=list[i].mobilephone%></td>
            <td><%=list[i].mailbox %> </td>
            <td><%=list[i].province%><%=list[i].city%><%=list[i].county%><%=list[i].address%></td>
            <td><%=timestamp(list[i].regtime,'yyyy-MM-dd hh:mm')%></td>
            <td>
                <button class="btn btn-danger padding5" onclick="">删除</button>
                <button class="btn btn-blue padding5" onclick="memberinfo(this,<%=list[i].id%>)">编辑</button>
            </td>
        </tr>
        <% } %>
        <% } else{%>
        <tr><td colspan="9">暂时还没有该等级的会员</td></tr>
        <% } %>
        </tbody>
    </table>
</script></body></html>